body {
	background-color: #59b2db;
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
}
header {
	height: 56px;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	.head-right {
		width: 75px;
		display: flex;
		justify-content: space-between;
		span {
			color: #fff;
			font-size: 28px;
		}
	}
	.head-left {
		color: #fff;
		.sporting-text {
			font-size: 24px;
		}
	}
}
.males {
	line-height: 110px;
	width: 100%;
	text-align: center;
	color: #fff;
	span {
		font-size: 70px;
	}
}
.gps {
	height: 40px;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	p {
		font-size: 14px;
		color: #acdfff;
	}
	div {
		width: 106px;
		height: 1px;
		border-top: 1px dashed #fff;
	}
	.iconfont {
		color: #fff;
		font-size: 32px;
	}
}
.time-list {
	height: 150px;
	width: 100%;
	display: flex;
	justify-content: space-around;
	align-items: center;
	div {
		height: 100%;
		width: 52px;
		display: flex;
		flex-direction: column;
		justify-content: space-evenly;
		align-items: center;
		color: #fff;
		span {
			font-size: 32px;
		}
	}
}
.time-out {
	height: 120px;
	width: 100%;
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	.parse,
	.continue,
	.stop {
		height: 100px;
		width: 100px;
		border-radius: 50%;
		background-color: #fff;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		color: #59b2db;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		span {
			font-size: 40px;
		}
	}
	.continue {
		background-color: #79f0c2;
		color: #fff;
		font-weight: bolder;
	}
	.stop {
		background-color: #ff6060;
		color: #fff;
	}
	.lock {
		width: 40px;
		line-height: 40px;
		border: 1px solid #fff;
		border-radius: 50%;
		text-align: center;
		color: #fff;
		margin-right: -104px;
		margin-left: -60px;
	}
}
#speed {
	font-size: 16px;
}
